@mixin tableRow ($bool) {
  // false 表头
  // true 表格
  @if $bool == false {
    &>div:nth-of-type(1) {
      width: 100px;
      text-align: center;
    }
    &>div:nth-of-type(2) {
      flex: 1;
      text-align: left;
    }
    &>div:nth-of-type(3) {
      width: 200px;
      text-align: center;
    }
    &>div:nth-of-type(4) {
      width: 200px;
      text-align: center;
    }
    &>div:nth-of-type(5) {
      width: 200px;
      text-align: center;
      user-select: none;
    }
    &>div:nth-of-type(6) {
      width: 200px;
      text-align: center;
    }
    &>div:nth-of-type(7) {
      width: 100px;
      text-align: center;
    }
  } @else {
    &>div:nth-of-type(1) {
      width: 100px;
      text-align: center;
    }
    &>div:nth-of-type(2) {
      flex: 1;
      text-align: left;
      display: flex;
      align-items: flex-start;
      img{
        cursor: pointer;
        border-radius: 8px;
      }
      span{
        cursor: pointer;
        margin-left: 10px;
        &:hover{
          text-decoration: underline;
          text-decoration-color: #e37215;
          color: #e37215;
        }
      }
    }
    &>div:nth-of-type(3) {
      width: 200px;
      text-align: center;
    }
    &>div:nth-of-type(4) {
      width: 200px;
      text-align: center;
    }
    &>div:nth-of-type(5) {
      width: 200px;
      text-align: center;
      user-select: none;
    }
    &>div:nth-of-type(6) {
      width: 200px;
      text-align: center;
      span{
        cursor: pointer;
        &:hover{
          text-decoration: underline;
          text-decoration-color: #e37215;
          color: #e37215;
        }
      }
    }
  }

}

.shopping{
  background-color: #fff;
  border-radius: 16px 16px 0 0;
  height: 100%;
  box-sizing: border-box;
  &_header{
    height: 100px;
    border-bottom: 1px solid;
    box-sizing: border-box;
    padding: 0 20px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    &_right{
      display: flex;
      align-items: center;
      button{
        //font-size: 50px;
        outline: none;
        border: none;
        display: inline-block;
        padding: 10px 20px;
        border-radius: 20px;
        cursor: not-allowed;
        &.shopping_header_right_btn{
          background-color: #e37215;
          color: #fff;
          cursor: pointer;
        }
      }
    }
    &_money {
      color: #f64b0d;
      margin: 0 20px;
      font-size: 24px;
    }
  }
  &_table{
    box-sizing: border-box;
    &_thead{
      display: flex;
      padding: 20px;
      align-items: center;
      @include tableRow(false);
    }
    &_tbody{
      padding: 20px;
      box-sizing: border-box;
      .icon{
        cursor: pointer;
      }
      .no_icon{
        cursor: not-allowed;
      }
      &_row{
        margin: 20px;
        display: flex;
        align-items: center;
        @include tableRow(true);
        padding: 20px 0;
        box-sizing: border-box;
      }
      &_rowActive{
        box-sizing: border-box;
        margin: 20px;
        display: flex;
        padding: 20px 0;
        align-items: center;
        @include tableRow(true);
        //background-color: #e37215;
        border: 1px solid #e37215;
        border-radius: 16px;
      }
    }
  }
}
